<!doctype html>
<html lang="ko">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0">
<link rel="shortcut icon" type="image/x-icon" href="../assets/favicon.ico">
<title>source\jindo.SelectArea.js - Jindo Component - AjaxUI@NHN</title>
<link rel="stylesheet" type="text/css" href="../assets/prettify/prettify-min.css" media="screen">
<script type="text/javascript">
	var isMobile = (function() {
		var r = window.devicePixelRatio || 1;
		if (/windows phone/i.test(navigator.userAgent)) { r = 2; }
		
		var s = Math.max(screen.width / r, screen.height / r);
		
		var m = s < 1024;
		var href = m ? "api.mobile.css" : "api.css";
		document.write('<link rel="stylesheet" type="text/css" href="../assets/' + href + '" media="screen">');
		
		return m;
	})();
</script>

<script type="text/javascript" src="../assets/jindo.desktop.min.js"></script>
<script type="text/javascript" src="../assets/jindo_component.min.js"></script>
</head>
<body class="api-page">
<div id="wrap" class="api-main"><!-- 2Depth 접기 : lft_fold 추가 -->

	<div id="header">
		<h1><a href="../index.html"><span class="blind">JindoJS</span></a></h1>
		<div class="info">
			<span class="version">version 1.6.0</span>
			<span class="bar">|</span>
			<span class="help"><span class="ic_help"></span><a href="http://devcode.nhncorp.com/projects/jindo-component/issue" target="_blank">버그신고/문의</a></span>
		</div>
		<div class="menu">
			<button type="button" id="toggle_search_btn" class="btn_sch"><span class="blind">검색</span></button>
			<button type="button" id="toggle_list_btn" class="btn_snb btn_snb_on"><span class="blind">메뉴</span></button>
			<!-- [D] 클릭시 btn_sch_on,btn_snb_on 추가 -->
		</div>
	</div>

	<!-- sch_frm -->
	<div class="sch_frm hide_when_small">
		<h2 class="blind">검색</h2>
		<div class="filter">
			<input type="search" id="api-filter" placeholder="검색어를 입력하세요.">
		</div>
		<div id="search-tab" style="display:none;">
			<ul class="tabs">
			<li class="tc-tab">전체</li>
			<li class="tc-tab">키워드</li>
			<li class="tc-tab">클래스</li>
			<li class="tc-tab">메서드</li>
			<li class="tc-tab">프로퍼티</li>
			<li class="tc-tab">이벤트</li>
			</ul>
			<div class="panels">
				<ul id="api-all" class="tc-panel"></ul>
				<ul id="api-keywords" class="tc-panel"></ul>
				<ul id="api-classes" class="tc-panel"></ul>
				<ul id="api-methods" class="tc-panel"></ul>
				<ul id="api-attrs" class="tc-panel"></ul>
				<ul id="api-events" class="tc-panel"></ul>
			</div>

		</div>
	</div>
	<!-- // sch_frm -->

	<!-- container -->
	<div id="container">
		<!-- left-columns -->
		<div id="left-columns" class="sidemenu has_scrollbar">
			<h2 class="blind"><a href="../index.html"><span>APIs</span></a></h2>
<div class="snb depth1 scrollbar hide_when_small">
	<!-- [D] style="width:135px; height:384px; -->
	<div class="scrollbar-box">
		<div class="scrollbar-content">
			<div><ul>
			            <li class="">
			            	<a href="../classes/jindo.Accordion.html" class="">
			                	Accordion
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.AjaxHistory.html" class="">
			                	AjaxHistory
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.BrowseButton.html" class="">
			                	BrowseButton
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.Cache.html" class="">
			                	Cache
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.Calendar.html" class="">
			                	Calendar
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.Canvas.html" class="">
			                	Canvas
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.CheckBox.html" class="">
			                	CheckBox
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.CircularRolling.html" class="">
			                	CircularRolling
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.Clipboard.html" class="">
			                	Clipboard
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.Component.html" class="">
			                	Component
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.DataBridge.html" class="">
			                	DataBridge
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.DatePicker.html" class="">
			                	DatePicker
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.DefaultTextValue.html" class="">
			                	DefaultTextValue
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.Dialog.html" class="">
			                	Dialog
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.DragArea.html" class="">
			                	DragArea
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.DropArea.html" class="">
			                	DropArea
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.DynamicTree.html" class="">
			                	DynamicTree
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.Effect.html" class="">
			                	Effect
								
								

							    
						        
						            <span class="flag static" title="static"><span class="blind">static</span></span>
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.FileUploader.html" class="">
			                	FileUploader
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.FloatingLayer.html" class="">
			                	FloatingLayer
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.Foggy.html" class="">
			                	Foggy
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.Formatter.html" class="">
			                	Formatter
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.HTMLComponent.html" class="">
			                	HTMLComponent
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.InlineTextEdit.html" class="">
			                	InlineTextEdit
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.LayerEffect.html" class="">
			                	LayerEffect
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.LayerManager.html" class="">
			                	LayerManager
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.LayerPosition.html" class="">
			                	LayerPosition
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.LazyLoading.html" class="">
			                	LazyLoading
								
								

							    
						        
						            <span class="flag static" title="static"><span class="blind">static</span></span>
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.ModalDialog.html" class="">
			                	ModalDialog
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.MouseGesture.html" class="">
			                	MouseGesture
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.MultipleAjaxRequest.html" class="">
			                	MultipleAjaxRequest
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.NumberFormatter.html" class="">
			                	NumberFormatter
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.NumericStepper.html" class="">
			                	NumericStepper
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.Pagination.html" class="">
			                	Pagination
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.Rolling.html" class="">
			                	Rolling
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.RollingChart.html" class="">
			                	RollingChart
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.RolloverArea.html" class="">
			                	RolloverArea
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.RolloverClick.html" class="">
			                	RolloverClick
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.ScrollBar.html" class="">
			                	ScrollBar
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.ScrollBox.html" class="">
			                	ScrollBox
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.SelectArea.html" class="">
			                	SelectArea
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.SelectBox.html" class="">
			                	SelectBox
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.Slider.html" class="">
			                	Slider
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.StarRating.html" class="">
			                	StarRating
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.TabControl.html" class="">
			                	TabControl
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.TextRange.html" class="">
			                	TextRange
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.Timer.html" class="">
			                	Timer
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.Transition.html" class="">
			                	Transition
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.Tree.html" class="">
			                	Tree
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.UIComponent.html" class="">
			                	UIComponent
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.UploadQueue.html" class="">
			                	UploadQueue
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.WatchInput.html" class="">
			                	WatchInput
								
								

							    
						        
			            	</a>
			            </li>
			        </ul></div>
		</div>
	</div>
	<div class="scrollbar-v">
		<div class="scrollbar-button-up"></div>
		<div class="scrollbar-track">
			<div class="scrollbar-thumb" style="top: 0px; height: 222px; "></div>
		</div>
		<div class="scrollbar-button-down"></div>
	</div>
</div>


<button type="button" title="펼치기" class="btn_open">바로가기 열기<span class="ic"></span></button>
<button type="button" title="접기" class="btn_close">바로가기 닫기<span class="ic"></span></button>

		</div>
		<!-- // left-columns -->

		<!-- main content -->
		<div id="main">
			<div class="main_fix">
				<div class="content">
	
	<h1 class="blind">source/jindo.SelectArea.js</h1>
	<div class="tc-panel first">
		<dl class="relation">
			<dt>파일명</dt>
			<dd>jindo.SelectArea.js</dd>
			<dt>경로</dt>
			<dd>source/</dd>
		</dl>
		<div id="file" class="file">
		    <pre class="code prettyprint linenums">/**
	@fileOverview&nbsp;특정&nbsp;영역안의&nbsp;지정된&nbsp;객체를&nbsp;단일/다중&nbsp;선택가능하게&nbsp;하는&nbsp;컴포넌트&nbsp;
	@author&nbsp;senxation
	@version&nbsp;#__VERSION__#
**/
/**
	특정&nbsp;영역안의&nbsp;지정된&nbsp;객체를&nbsp;단일/다중&nbsp;선택가능하게&nbsp;하는&nbsp;컴포넌트
	&nbsp;
	@class&nbsp;jindo.SelectArea
	@extends&nbsp;jindo.UIComponent
	@keyword&nbsp;selectearea,&nbsp;셀렉트에어리어,&nbsp;선택,&nbsp;단일,&nbsp;다중,&nbsp;영역
**/
jindo.SelectArea&nbsp;=&nbsp;jindo.$Class({
	/**&nbsp;@lends&nbsp;jindo.SelectArea.prototype&nbsp;*/
	
	_waToggleCandidate&nbsp;:&nbsp;null,
	_waSelected&nbsp;:&nbsp;null,
	_aSizeInfo&nbsp;:&nbsp;null,
	
	/**
		@constructor
		@param&nbsp;{HTMLElement}&nbsp;el&nbsp;기준&nbsp;엘리먼트
		@param&nbsp;{Object}&nbsp;[htOption]&nbsp;옵션&nbsp;객체
			@param&nbsp;{String}&nbsp;[htOption.sClassName=&quot;selectable&quot;]
			@param&nbsp;{Object}&nbsp;[htOption.htStatus={sSelected:&quot;sSelected&quot;//선택되었을때}]&nbsp;엘리먼트의&nbsp;상태에&nbsp;따라&nbsp;추가되는&nbsp;클래스명
			@param&nbsp;{Boolean}&nbsp;[htOption.bMultiSelection=true]&nbsp;다중&nbsp;선택&nbsp;가능&nbsp;여부
			@param&nbsp;{Boolean}&nbsp;[htOption.bDragSelect=true]&nbsp;다중&nbsp;선택&nbsp;가능한&nbsp;경우,&nbsp;드래그하여&nbsp;선택&nbsp;가능&nbsp;여부.&nbsp;(bMultiSelection&nbsp;옵션&nbsp;값이&nbsp;true일때만&nbsp;사용가능)
			@param&nbsp;{Number}&nbsp;[htOption.nThreshold=5]&nbsp;드래스&nbsp;선택이&nbsp;시작되기위한&nbsp;최소&nbsp;마우스이동거리
			@param&nbsp;{Boolean}&nbsp;[htOption.bDeselectAllOutside=true]&nbsp;다중&nbsp;선택&nbsp;가능한&nbsp;경우,&nbsp;셀렉트가능한&nbsp;객체가&nbsp;아닌&nbsp;곳을&nbsp;클릭하면&nbsp;모두&nbsp;선택해제&nbsp;할지&nbsp;여부&nbsp;(bMultiSelection&nbsp;옵션&nbsp;값이&nbsp;true일때만&nbsp;true로&nbsp;지정가능)
			@param&nbsp;{Boolean}&nbsp;[htOption.bRemainOne=false]&nbsp;단일&nbsp;선택만&nbsp;가능한&nbsp;경우,&nbsp;최소&nbsp;하나는&nbsp;선택이&nbsp;되어있도록&nbsp;함.&nbsp;(bMultiSelection&nbsp;옵션&nbsp;값이&nbsp;false일때만&nbsp;true로&nbsp;지정가능)
			@param&nbsp;{Boolean}&nbsp;[htOption.bToggleSelected=false]&nbsp;단일&nbsp;선택만&nbsp;가능하고,&nbsp;전체&nbsp;선택해제가능할경우,&nbsp;선택된&nbsp;객체를&nbsp;다시&nbsp;클릭했을때&nbsp;선택해제&nbsp;할지&nbsp;여부.&nbsp;(bMultiSelection&nbsp;옵션&nbsp;값이&nbsp;false,&nbsp;bRemainOne이&nbsp;false인&nbsp;경우에만&nbsp;true로&nbsp;지정가능)
			@param&nbsp;{Boolean}&nbsp;[htOption.bActivateOnload=true]&nbsp;초기화시&nbsp;activate()&nbsp;수행여부
		@example
			var&nbsp;oSelectArea&nbsp;=&nbsp;new&nbsp;jindo.SelectArea(jindo.$(&quot;select&quot;),&nbsp;{
				bActivateOnload&nbsp;:&nbsp;true,&nbsp;//(Boolean)&nbsp;초기화시&nbsp;활성여부
				sClassName&nbsp;:&nbsp;&quot;selectable&quot;,&nbsp;//(String)&nbsp;셀렉트&nbsp;가능한&nbsp;엘리먼트에&nbsp;지정된&nbsp;클래스명
				htStatus&nbsp;:&nbsp;{
					sSelected&nbsp;:&nbsp;&quot;selected&quot;&nbsp;//(String)&nbsp;셀렉트된&nbsp;엘리먼트에&nbsp;추가되는&nbsp;클래스명
				},
				bMultiSelection&nbsp;:&nbsp;true,&nbsp;//다중&nbsp;선택&nbsp;가능&nbsp;여부
				bDragSelect&nbsp;:&nbsp;true,&nbsp;//다중&nbsp;선택&nbsp;가능한&nbsp;경우,&nbsp;드래그하여&nbsp;선택&nbsp;가능&nbsp;여부.&nbsp;(bMultiSelection&nbsp;옵션&nbsp;값이&nbsp;true일때만&nbsp;사용가능)
				nThreshold&nbsp;:&nbsp;5,
				bDeselectAllOutside&nbsp;:&nbsp;true,&nbsp;//다중&nbsp;선택&nbsp;가능한&nbsp;경우,&nbsp;셀렉트가능한&nbsp;객체가&nbsp;아닌&nbsp;곳을&nbsp;클릭하면&nbsp;모두&nbsp;선택해제&nbsp;할지&nbsp;여부&nbsp;(bMultiSelection&nbsp;옵션&nbsp;값이&nbsp;true일때만&nbsp;true로&nbsp;지정가능)
				bRemainOne&nbsp;:&nbsp;false,&nbsp;//단일&nbsp;선택만&nbsp;가능한&nbsp;경우,&nbsp;최소&nbsp;하나는&nbsp;선택이&nbsp;되어있도록&nbsp;함.&nbsp;(bMultiSelection&nbsp;옵션&nbsp;값이&nbsp;false일때만&nbsp;true로&nbsp;지정가능)
				bToggleSelected&nbsp;:&nbsp;false&nbsp;//&nbsp;단일&nbsp;선택만&nbsp;가능하고,&nbsp;전체&nbsp;선택해제가능할경우,&nbsp;선택된&nbsp;객체를&nbsp;다시&nbsp;클릭했을때&nbsp;선택해제&nbsp;할지&nbsp;여부.&nbsp;(bMultiSelection&nbsp;옵션&nbsp;값이&nbsp;false,&nbsp;bRemainOne이&nbsp;false인&nbsp;경우에만&nbsp;true로&nbsp;지정가능)
			}).attach({
				selectStart&nbsp;:&nbsp;function(oCustomEvent)&nbsp;{
					//선택가능한&nbsp;객체&nbsp;위에서&nbsp;마우스다운되었을때&nbsp;발생
					//oCustomEvent&nbsp;=&nbsp;{
					//	vLastSelected&nbsp;:&nbsp;(Array&nbsp;||&nbsp;HTMLElement)&nbsp;이전에&nbsp;선택된&nbsp;객체,
					//	elSelectable&nbsp;:&nbsp;(HTMLElement)&nbsp;마우스다운된&nbsp;선택가능한&nbsp;객체,
					//	bWithinSelected&nbsp;:&nbsp;(Boolean)&nbsp;이전에&nbsp;선택된&nbsp;객체들&nbsp;중에서&nbsp;선택이&nbsp;시작되었는지&nbsp;여부,
					//	weEvent&nbsp;:&nbsp;(jindo.$Event)&nbsp;mousedown&nbsp;이벤트
					//}
				},
				beforeSelect&nbsp;:&nbsp;function(oCustomEvent)&nbsp;{
					//객체가&nbsp;선택되기&nbsp;전&nbsp;발생
					//oCustomEvent&nbsp;=&nbsp;{&nbsp;
					//	elSelectable&nbsp;:&nbsp;(HTMLElement)&nbsp;선택될&nbsp;객체,
					//	nIndex&nbsp;:&nbsp;(Number)&nbsp;선택될&nbsp;객체의&nbsp;인덱스,
					//	bSelectedAgain&nbsp;:&nbsp;(Boolean)&nbsp;이전&nbsp;선택된&nbsp;객체가&nbsp;선택하려는&nbsp;객체와&nbsp;동일한지&nbsp;여부&nbsp;(이전선택된&nbsp;객체가&nbsp;하나일때)
					//}
				},
				select&nbsp;:&nbsp;function(oCustomEvent)&nbsp;{
					//객체가&nbsp;선택된&nbsp;후&nbsp;발생
					//oCustomEvent&nbsp;=&nbsp;{&nbsp;
					//	elSelectable&nbsp;:&nbsp;(HTMLElement)&nbsp;선택된&nbsp;객체,
					//	nIndex&nbsp;:&nbsp;(Number)&nbsp;선택된&nbsp;객체의&nbsp;인덱스,
					//	bSelectedAgain&nbsp;:&nbsp;(Boolean)&nbsp;이전&nbsp;선택된&nbsp;객체가&nbsp;선택된&nbsp;객체와&nbsp;동일한지&nbsp;여부&nbsp;(이전선택된&nbsp;객체가&nbsp;하나일때)
					//}
				},
				beforeDeselect&nbsp;:&nbsp;function(oCustomEvent)&nbsp;{
					//객체가&nbsp;선택해제되기&nbsp;전&nbsp;발생
					//oCustomEvent&nbsp;=&nbsp;{&nbsp;
					//	elSelectable&nbsp;:&nbsp;(HTMLElement)&nbsp;선택해제될&nbsp;객체,
					//	nIndex&nbsp;:&nbsp;(Number)&nbsp;선택해제될&nbsp;객체의&nbsp;인덱스
					//}
				},
				deselect&nbsp;:&nbsp;function(oCustomEvent)&nbsp;{
					//객체가&nbsp;선택해제된&nbsp;후&nbsp;발생
					//oCustomEvent&nbsp;=&nbsp;{&nbsp;
					//	elSelectable&nbsp;:&nbsp;(HTMLElement)&nbsp;선택해제된&nbsp;객체,
					//	nIndex&nbsp;:&nbsp;(Number)&nbsp;선택해제된&nbsp;객체의&nbsp;인덱스
					//}
				},
				change&nbsp;:&nbsp;function(oCustomEvent)&nbsp;{
					//선택된&nbsp;값이&nbsp;이전&nbsp;선택&nbsp;값과&nbsp;달라졌을&nbsp;때&nbsp;발생
				},
				selectEnd&nbsp;:&nbsp;function(oCustomEvent)&nbsp;{
					//선택이&nbsp;종료되었을&nbsp;때&nbsp;발생
					//oCustomEvent&nbsp;=&nbsp;{
					//	vSelected&nbsp;:&nbsp;(Array&nbsp;||&nbsp;HTMLElement)&nbsp;선택된&nbsp;객체
					//}
				},
				dragStart&nbsp;:&nbsp;function(oCustomEvent)&nbsp;{
					//다중선택시&nbsp;drag를&nbsp;시작할&nbsp;때&nbsp;발생
				},
				dragSelecting&nbsp;:&nbsp;function(oCustomEvent)&nbsp;{
					//drag되어&nbsp;설정된&nbsp;선택영역안에&nbsp;선택가능한&nbsp;객체가&nbsp;변경될때&nbsp;발생&nbsp;
					//oCustomEvent&nbsp;=&nbsp;{&nbsp;
					//	aSelectable&nbsp;:&nbsp;(Array)&nbsp;선택영역안에&nbsp;포함된&nbsp;객체
					//}
				},
				dragEnd&nbsp;:&nbsp;function(oCustomEvent)&nbsp;{
					//다중선택시&nbsp;drag가&nbsp;끝났을&nbsp;때&nbsp;발생
				}
			});
	**/
	$init&nbsp;:&nbsp;function(el,&nbsp;htOption)&nbsp;{
		this._el&nbsp;=&nbsp;jindo.$(el);
		this._wel&nbsp;=&nbsp;jindo.$Element(this._el);&nbsp;
		var&nbsp;htDefaultOption&nbsp;=&nbsp;{
			bActivateOnload&nbsp;:&nbsp;true,&nbsp;//(Boolean)&nbsp;초기화시&nbsp;활성여부
			sClassName&nbsp;:&nbsp;&quot;selectable&quot;,&nbsp;//(String)&nbsp;셀렉트&nbsp;가능한&nbsp;엘리먼트에&nbsp;지정된&nbsp;클래스명
			htStatus&nbsp;:&nbsp;{
				sSelected&nbsp;:&nbsp;&quot;selected&quot;&nbsp;//(String)&nbsp;셀렉트된&nbsp;엘리먼트에&nbsp;추가되는&nbsp;클래스명
			},
			bMultiSelection&nbsp;:&nbsp;true,&nbsp;//다중&nbsp;선택&nbsp;가능&nbsp;여부
			bDragSelect&nbsp;:&nbsp;true,&nbsp;//다중&nbsp;선택&nbsp;가능한&nbsp;경우,&nbsp;드래그하여&nbsp;선택&nbsp;가능&nbsp;여부.&nbsp;(bMultiSelection&nbsp;옵션&nbsp;값이&nbsp;true일때만&nbsp;사용가능)
			nThreshold&nbsp;:&nbsp;5,
			bDeselectAllOutside&nbsp;:&nbsp;true,&nbsp;//다중&nbsp;선택&nbsp;가능한&nbsp;경우,&nbsp;셀렉트가능한&nbsp;객체가&nbsp;아닌&nbsp;곳을&nbsp;클릭하면&nbsp;모두&nbsp;선택해제&nbsp;할지&nbsp;여부&nbsp;(bMultiSelection&nbsp;옵션&nbsp;값이&nbsp;true일때만&nbsp;true로&nbsp;지정가능)
			bRemainOne&nbsp;:&nbsp;false,&nbsp;//단일&nbsp;선택만&nbsp;가능한&nbsp;경우,&nbsp;최소&nbsp;하나는&nbsp;선택이&nbsp;되어있도록&nbsp;함.&nbsp;(bMultiSelection&nbsp;옵션&nbsp;값이&nbsp;false일때만&nbsp;true로&nbsp;지정가능)
			bToggleSelected&nbsp;:&nbsp;false&nbsp;//&nbsp;단일&nbsp;선택만&nbsp;가능하고,&nbsp;전체&nbsp;선택해제가능할경우,&nbsp;선택된&nbsp;객체를&nbsp;다시&nbsp;클릭했을때&nbsp;선택해제&nbsp;할지&nbsp;여부.&nbsp;(bMultiSelection&nbsp;옵션&nbsp;값이&nbsp;false,&nbsp;bRemainOne이&nbsp;false인&nbsp;경우에만&nbsp;true로&nbsp;지정가능)&nbsp;&nbsp;&nbsp;
		};
		this.option(htDefaultOption);
		this.option(htOption&nbsp;||&nbsp;{});
		
		this._waToggleCandidate&nbsp;=&nbsp;jindo.$A([]);
		this._waSelected&nbsp;=&nbsp;jindo.$A([]);
		this._sCtrl&nbsp;=&nbsp;(jindo.$Agent().os().mac)&nbsp;?&nbsp;&quot;meta&quot;&nbsp;:&nbsp;&quot;ctrl&quot;;
		this._welRectIndicator&nbsp;=&nbsp;null;
		this._wfDragStart&nbsp;=&nbsp;jindo.$Fn(this._onDragSelectStart,&nbsp;this);
		this._wfSelectStart&nbsp;=&nbsp;jindo.$Fn(this._onDragSelectStart,&nbsp;this);
		this._wfMouseDown&nbsp;=&nbsp;jindo.$Fn(this._onMouseDown,&nbsp;this);
		this._wfMouseMove&nbsp;=&nbsp;jindo.$Fn(this._onMouseMove,&nbsp;this);
		this._wfMouseUp&nbsp;=&nbsp;jindo.$Fn(this._onMouseUp,&nbsp;this);
		this._wfMouseUpWithinSelected&nbsp;=&nbsp;jindo.$Fn(this._onMouseUpWithinSelected,&nbsp;this);
		this._wfCompute&nbsp;=&nbsp;jindo.$Fn(this._computeSizeAndPos,&nbsp;this);
		
		if&nbsp;(this.option(&quot;bActivateOnload&quot;))&nbsp;{
			this.activate();
		}
	},
	
	/**
		기준&nbsp;엘리먼트의&nbsp;모든&nbsp;셀렉트가능한&nbsp;엘리먼트를&nbsp;가져온다.
		
		@method&nbsp;getSelectableElement
		@return&nbsp;{Array}
	**/
	getSelectableElement&nbsp;:&nbsp;function()&nbsp;{
		return&nbsp;jindo.$$(&quot;.&quot;&nbsp;+&nbsp;this.option(&quot;sClassName&quot;),&nbsp;this._el);
	},
	
	isSelectable&nbsp;:&nbsp;function(el)&nbsp;{
		return&nbsp;jindo.$Element(el).isChildOf(this._el)&nbsp;&amp;&amp;&nbsp;jindo.$$.test(el,&nbsp;&quot;.&quot;&nbsp;+&nbsp;this.option(&quot;sClassName&quot;));
	},
	
	/**
		지정된&nbsp;셀렉트가능한&nbsp;엘리먼트가&nbsp;전체&nbsp;셀렉트가능한&nbsp;엘리먼트중&nbsp;몇번째&nbsp;엘리먼트인지&nbsp;가져온다.
		
		@method&nbsp;getIndex
		@param&nbsp;{HTMLElement}&nbsp;el&nbsp;순서를&nbsp;얻고자&nbsp;하는&nbsp;엘리먼트
		@return&nbsp;{Number}&nbsp;n
	**/
	getIndex&nbsp;:&nbsp;function(el)&nbsp;{
		return&nbsp;jindo.$A(this.getSelectableElement()).indexOf(el);
	},
	
	/**
		지정된&nbsp;엘리먼트를&nbsp;선택한다.
		
		@method&nbsp;select
		@param&nbsp;{Array&nbsp;||&nbsp;HTMLElement}&nbsp;a&nbsp;선택할&nbsp;엘리먼트&nbsp;또는&nbsp;배열
		@param&nbsp;{Boolean}&nbsp;bRemainSelected&nbsp;이미&nbsp;선택된&nbsp;엘리먼트를&nbsp;선택해제하지&nbsp;않고&nbsp;남겨둘지&nbsp;여부&nbsp;(디폴트는&nbsp;단독으로&nbsp;선택됨)
		@param&nbsp;{Boolean}&nbsp;bFireChangeEvent&nbsp;기존&nbsp;선택&nbsp;값과&nbsp;달라진&nbsp;경우&nbsp;change&nbsp;커스텀&nbsp;이벤트를&nbsp;발생할지&nbsp;여부&nbsp;(디폴트&nbsp;true)
		@return&nbsp;{this}&nbsp;
		@remark&nbsp;bMultiSelection&nbsp;옵션이&nbsp;false이면&nbsp;bRemainSelected를&nbsp;true로&nbsp;지정하여도&nbsp;기존&nbsp;선택이&nbsp;모두&nbsp;해제된다.
	**/
	select&nbsp;:&nbsp;function(a,&nbsp;bRemainSelected,&nbsp;bFireChangeEvent)&nbsp;{
		a&nbsp;=&nbsp;this._convertArray(a);
		if&nbsp;(typeof&nbsp;bRemainSelected&nbsp;==&nbsp;&quot;undefined&quot;)&nbsp;{
			bRemainSelected&nbsp;=&nbsp;false;
		}
		if&nbsp;(typeof&nbsp;bFireChangeEvent&nbsp;==&nbsp;&quot;undefined&quot;)&nbsp;{
			bFireChangeEvent&nbsp;=&nbsp;true;
		}
		
		if&nbsp;(!bRemainSelected&nbsp;||&nbsp;!this.option(&quot;bMultiSelection&quot;))&nbsp;{
			this.deselectAll(false);
		}
		
		var&nbsp;aLastSelected&nbsp;=&nbsp;this._convertArray(this.getSelected()).concat();
		
		var&nbsp;htStatus&nbsp;=&nbsp;this.option(&quot;htStatus&quot;);
		
		for&nbsp;(var&nbsp;i&nbsp;=&nbsp;0;&nbsp;i&nbsp;&lt;&nbsp;a.length;&nbsp;i++)&nbsp;{
			var&nbsp;el&nbsp;=&nbsp;a[i];
			var&nbsp;wel&nbsp;=&nbsp;jindo.$Element(el);
			
			var&nbsp;htCustomEvent&nbsp;=&nbsp;{&nbsp;
				elSelectable&nbsp;:&nbsp;el,
				nIndex&nbsp;:&nbsp;this.getIndex(el),
				bSelectedAgain&nbsp;:&nbsp;(a.length&nbsp;===&nbsp;1&nbsp;&amp;&amp;&nbsp;this._vLastSelected&nbsp;===&nbsp;a[0])
			};
			
			/**
				객체가&nbsp;선택되기&nbsp;전
				
				@event&nbsp;beforeSelect
				@param&nbsp;{String}&nbsp;sType&nbsp;커스텀&nbsp;이벤트명
				@param&nbsp;{HTMLElement}&nbsp;elSelectable&nbsp;선택될&nbsp;객체
				@param&nbsp;{Number}&nbsp;nIndex&nbsp;선택될&nbsp;객체의&nbsp;인덱스
				@param&nbsp;{Boolean}&nbsp;bSelectedAgain&nbsp;이전&nbsp;선택된&nbsp;객체가&nbsp;선택하려는&nbsp;객체와&nbsp;동일한지&nbsp;여부&nbsp;(이전선택된&nbsp;객체가&nbsp;하나일때)
				@param&nbsp;{Function}&nbsp;stop&nbsp;수행시&nbsp;객체가&nbsp;선택되지&nbsp;않음
				@example
					커스텀&nbsp;이벤트&nbsp;핸들링&nbsp;예제
					oSelectArea.attach(&quot;beforeSelect&quot;,&nbsp;function(oCustomEvent)&nbsp;{&nbsp;...&nbsp;});
			**/
			if&nbsp;(this.isSelectable(el)&nbsp;&amp;&amp;&nbsp;!this.isSelected(el)&nbsp;&amp;&amp;&nbsp;this.fireEvent(&quot;beforeSelect&quot;,&nbsp;htCustomEvent))&nbsp;{
				
				htCustomEvent&nbsp;=&nbsp;{&nbsp;
					elSelectable&nbsp;:&nbsp;el,
					nIndex&nbsp;:&nbsp;this.getIndex(el),
					bSelectedAgain&nbsp;:&nbsp;(a.length&nbsp;===&nbsp;1&nbsp;&amp;&amp;&nbsp;this._vLastSelected&nbsp;===&nbsp;a[0])
				};
				
				wel.addClass(htStatus.sSelected);
				this._waSelected.push(el);
				/**
					객체가&nbsp;선택된&nbsp;후
					
					@event&nbsp;select
					@param&nbsp;{String}&nbsp;sType&nbsp;커스텀&nbsp;이벤트명
					@param&nbsp;{HTMLElement}&nbsp;elSelectable&nbsp;선택된&nbsp;객체
					@param&nbsp;{Number}&nbsp;nIndex&nbsp;선택된&nbsp;객체의&nbsp;인덱스
					@param&nbsp;{Boolean}&nbsp;bSelectedAgain&nbsp;이전&nbsp;선택된&nbsp;객체가&nbsp;선택된&nbsp;객체와&nbsp;동일한지&nbsp;여부&nbsp;(이전선택된&nbsp;객체가&nbsp;하나일때)
					@example
						//&nbsp;커스텀&nbsp;이벤트&nbsp;핸들링&nbsp;예제
						oSelectArea.attach(&quot;select&quot;,&nbsp;function(oCustomEvent)&nbsp;{&nbsp;...&nbsp;});
				**/
				this.fireEvent(&quot;select&quot;,&nbsp;htCustomEvent);
			}
		}
		
		if&nbsp;(bFireChangeEvent)&nbsp;{
			this._fireChangeEvent(aLastSelected);
		}
		
		return&nbsp;this;
	},
	
	/**
		지정된&nbsp;엘리먼트를&nbsp;선택해제한다.
		
		@method&nbsp;deselect
		@param&nbsp;{Array&nbsp;||&nbsp;HTMLElement}&nbsp;a&nbsp;선택해제할&nbsp;엘리먼트&nbsp;또는&nbsp;배열
		@param&nbsp;{Boolean}&nbsp;bFireChangeEvent&nbsp;기존&nbsp;선택&nbsp;값과&nbsp;달라진&nbsp;경우&nbsp;change&nbsp;커스텀&nbsp;이벤트를&nbsp;발생할지&nbsp;여부&nbsp;(디폴트&nbsp;true)
		@return&nbsp;{this}&nbsp;
	**/
	deselect&nbsp;:&nbsp;function(a,&nbsp;bFireChangeEvent)&nbsp;{
		a&nbsp;=&nbsp;this._convertArray(a);
		if&nbsp;(typeof&nbsp;bFireChangeEvent&nbsp;==&nbsp;&quot;undefined&quot;)&nbsp;{
			bFireChangeEvent&nbsp;=&nbsp;true;
		}
		
		var&nbsp;aLastSelected&nbsp;=&nbsp;this._convertArray(this.getSelected()).concat();
		
		var&nbsp;htStatus&nbsp;=&nbsp;this.option(&quot;htStatus&quot;);
		for&nbsp;(var&nbsp;i&nbsp;=&nbsp;0;&nbsp;i&nbsp;&lt;&nbsp;a.length;&nbsp;i++)&nbsp;{
			var&nbsp;el&nbsp;=&nbsp;a[i];
			var&nbsp;wel&nbsp;=&nbsp;jindo.$Element(el);
			var&nbsp;htParam&nbsp;=&nbsp;{&nbsp;
				elSelectable&nbsp;:&nbsp;el,&nbsp;
				nIndex&nbsp;:&nbsp;this.getIndex(el)&nbsp;
			};
			
			/**
				객체가&nbsp;선택해제되기&nbsp;전
				
				@event&nbsp;beforeDeselect
				@param&nbsp;{String}&nbsp;sType&nbsp;커스텀&nbsp;이벤트명
				@param&nbsp;{HTMLElement}&nbsp;elSelectable&nbsp;선택해제될&nbsp;객체
				@param&nbsp;{Number}&nbsp;nIndex&nbsp;선택해제될&nbsp;객체의&nbsp;인덱스
				@param&nbsp;{Function}&nbsp;stop&nbsp;수행시&nbsp;객체가&nbsp;선택해제되지&nbsp;않음
				@example
					//&nbsp;커스텀&nbsp;이벤트&nbsp;핸들링&nbsp;예제
					oSelectArea.attach(&quot;beforeDeselect&quot;,&nbsp;function(oCustomEvent)&nbsp;{&nbsp;...&nbsp;});
			**/
			if&nbsp;(this.isSelectable(el)&nbsp;&amp;&amp;&nbsp;this.isSelected(el)&nbsp;&amp;&amp;&nbsp;this.fireEvent(&quot;beforeDeselect&quot;,&nbsp;htParam))&nbsp;{
				wel.removeClass(htStatus.sSelected);
				this._waSelected&nbsp;=&nbsp;this._waSelected.refuse(el);
				/**
					객체가&nbsp;선택해제된&nbsp;후
					
					@event&nbsp;deselect
					@param&nbsp;{String}&nbsp;sType&nbsp;커스텀&nbsp;이벤트명
					@param&nbsp;{HTMLElement}&nbsp;elSelectable&nbsp;선택해제된&nbsp;객체
					@param&nbsp;{Number}&nbsp;nIndex&nbsp;선택해제된&nbsp;객체의&nbsp;인덱스
					@example
						//&nbsp;커스텀&nbsp;이벤트&nbsp;핸들링&nbsp;예제
						oSelectArea.attach(&quot;deselect&quot;,&nbsp;function(oCustomEvent)&nbsp;{&nbsp;...&nbsp;});
				**/
				this.fireEvent(&quot;deselect&quot;,&nbsp;htParam);
			}
		}
		
		if&nbsp;(bFireChangeEvent)&nbsp;{
			this._fireChangeEvent(aLastSelected);
		}
		
		return&nbsp;this;
	},
	
	/**
		모든&nbsp;선택된&nbsp;엘리먼트를&nbsp;선택해제한다.
		
		@method&nbsp;deselectAll
		@param&nbsp;{Boolean}&nbsp;bFireChangeEvent&nbsp;기존&nbsp;선택&nbsp;값과&nbsp;달라진&nbsp;경우&nbsp;change&nbsp;커스텀&nbsp;이벤트를&nbsp;발생할지&nbsp;여부&nbsp;(디폴트&nbsp;true)
		@return&nbsp;{this}
	**/
	deselectAll&nbsp;:&nbsp;function(bFireChangeEvent)&nbsp;{
		if&nbsp;(typeof&nbsp;bFireChangeEvent&nbsp;==&nbsp;&quot;undefined&quot;)&nbsp;{
			bFireChangeEvent&nbsp;=&nbsp;true;
		}
		this.deselect(this.getSelected(),&nbsp;bFireChangeEvent);
		return&nbsp;this;
	},
	
	/**
		지정된&nbsp;엘리먼트를&nbsp;선택반전한다.
		
		@method&nbsp;toggle
		@param&nbsp;{Array&nbsp;||&nbsp;HTMLElement}&nbsp;a&nbsp;선택해제할&nbsp;엘리먼트&nbsp;또는&nbsp;배열
		@param&nbsp;{Boolean}&nbsp;bFireChangeEvent&nbsp;기존&nbsp;선택&nbsp;값과&nbsp;달라진&nbsp;경우&nbsp;change&nbsp;커스텀&nbsp;이벤트를&nbsp;발생할지&nbsp;여부&nbsp;(디폴트&nbsp;true)
		@return&nbsp;{this}&nbsp;
	**/
	toggle&nbsp;:&nbsp;function(a,&nbsp;bFireChangeEvent)&nbsp;{
		a&nbsp;=&nbsp;this._convertArray(a);
		if&nbsp;(typeof&nbsp;bFireChangeEvent&nbsp;==&nbsp;&quot;undefined&quot;)&nbsp;{
			bFireChangeEvent&nbsp;=&nbsp;true;
		}
		for&nbsp;(var&nbsp;i&nbsp;=&nbsp;0;&nbsp;i&nbsp;&lt;&nbsp;a.length;&nbsp;i++)&nbsp;{
			var&nbsp;el&nbsp;=&nbsp;a[i];
			if&nbsp;(!this.isSelected(el))&nbsp;{
				this.select(el,&nbsp;true,&nbsp;bFireChangeEvent);
			}&nbsp;else&nbsp;{
				this.deselect(el,&nbsp;bFireChangeEvent);
			}
		}
		return&nbsp;this;
	},
	
	/**
		선택된&nbsp;엘리먼트를&nbsp;가져온다.
		
		@method&nbsp;getSelected
		@return&nbsp;{Array&nbsp;||&nbsp;HTMLElement}
		@remark&nbsp;다중&nbsp;선택된&nbsp;경우&nbsp;리턴되는&nbsp;배열은&nbsp;선택된&nbsp;순서정보를&nbsp;포함한다.
	**/
	getSelected&nbsp;:&nbsp;function()&nbsp;{
		if&nbsp;(this._waSelected.length()&nbsp;&gt;&nbsp;0)&nbsp;{
			return&nbsp;(this._waSelected.length()&nbsp;===&nbsp;1)&nbsp;?&nbsp;this._waSelected.get(0)&nbsp;:&nbsp;this._waSelected.$value();
		}
		return&nbsp;null;
	},
	
	/**
		지정된&nbsp;엘리먼트의&nbsp;선택여부를&nbsp;리턴한다.
		
		@method&nbsp;isSelected
		@param&nbsp;{HTMLElement}&nbsp;el&nbsp;선택&nbsp;여부를&nbsp;알고자&nbsp;하는&nbsp;엘리먼트
		@return&nbsp;{Boolean}
	**/
	isSelected&nbsp;:&nbsp;function(el)&nbsp;{
		return&nbsp;this._waSelected.has(el);
	},
	
	_getSelectableUntil&nbsp;:&nbsp;function(el)&nbsp;{
		var&nbsp;aReturn&nbsp;=&nbsp;el;
		var&nbsp;elFrom&nbsp;=&nbsp;this._elStartPoint;
		if&nbsp;(elFrom&nbsp;&amp;&amp;&nbsp;this.isSelected(elFrom))&nbsp;{
			var&nbsp;wa&nbsp;=&nbsp;jindo.$A(this.getSelectableElement());
			var&nbsp;nFrom&nbsp;=&nbsp;wa.indexOf(elFrom);
			var&nbsp;nTo&nbsp;=&nbsp;wa.indexOf(el);
			aReturn&nbsp;=&nbsp;wa.slice(Math.min(nFrom,&nbsp;nTo),&nbsp;Math.min(nFrom,&nbsp;nTo)&nbsp;+&nbsp;Math.abs(nFrom&nbsp;-&nbsp;nTo)&nbsp;+&nbsp;1).$value();
		}&nbsp;
		return&nbsp;aReturn;
	},
	
	_findSelectableElement&nbsp;:&nbsp;function(el)&nbsp;{
		var&nbsp;sClassName&nbsp;=&nbsp;this.option(&quot;sClassName&quot;);
		return&nbsp;(jindo.$$.test(el,&nbsp;&quot;.&quot;&nbsp;+&nbsp;sClassName))&nbsp;?&nbsp;el&nbsp;:&nbsp;jindo.$$.getSingle(&quot;!&nbsp;.&quot;&nbsp;+sClassName,&nbsp;el);&nbsp;
	},
	
	_isChanged&nbsp;:&nbsp;function(aLastSelected)&nbsp;{
		var&nbsp;waLast&nbsp;=&nbsp;jindo.$A(aLastSelected),
			a&nbsp;=&nbsp;this._convertArray(this.getSelected());
			
		if&nbsp;(aLastSelected.length&nbsp;!=&nbsp;a.length)&nbsp;{
			return&nbsp;true;
		}
		
		for&nbsp;(var&nbsp;i&nbsp;=&nbsp;0;&nbsp;i&nbsp;&lt;&nbsp;a.length;&nbsp;i++)&nbsp;{
			if&nbsp;(!waLast.has(a[i]))&nbsp;{
				return&nbsp;true;
			}
		}
		
		return&nbsp;false;
	},
	
	_fireChangeEvent&nbsp;:&nbsp;function(aLastSelected)&nbsp;{
		if&nbsp;(this._isChanged(aLastSelected))&nbsp;{
			/**
				선택된&nbsp;값이&nbsp;이전&nbsp;선택&nbsp;값과&nbsp;달라졌을&nbsp;때&nbsp;발생
				
				@event&nbsp;change
				@param&nbsp;{String}&nbsp;sType&nbsp;커스텀&nbsp;이벤트명
				@example
					//&nbsp;커스텀&nbsp;이벤트&nbsp;핸들링&nbsp;예제
					oSelectArea.attach(&quot;change&quot;,&nbsp;function(oCustomEvent)&nbsp;{&nbsp;...&nbsp;});
			**/
			this.fireEvent(&quot;change&quot;);
		}
	},
	
	_convertArray&nbsp;:&nbsp;function(a)&nbsp;{
		if&nbsp;(!(a&nbsp;instanceof&nbsp;Array))&nbsp;{
			if&nbsp;(a)&nbsp;{
				a&nbsp;=&nbsp;[a];
			}&nbsp;else&nbsp;{
				a&nbsp;=&nbsp;[];
			}
		}
		return&nbsp;a;
	},
	
	_onMouseDown&nbsp;:&nbsp;function(we)&nbsp;{
		var&nbsp;htKey&nbsp;=&nbsp;we.key();
		var&nbsp;htMouse&nbsp;=&nbsp;we.mouse(true);
		
		if&nbsp;(htMouse.scrollbar)&nbsp;{&nbsp;return;&nbsp;}
		
		var&nbsp;elSelectable&nbsp;=&nbsp;this._findSelectableElement(we.element);
		var&nbsp;aLastSelected&nbsp;=&nbsp;this._convertArray(this.getSelected()).concat();
		this._vLastSelected&nbsp;=&nbsp;this.getSelected();
		this._waSelectable&nbsp;=&nbsp;jindo.$A(this.getSelectableElement());
		this._waLastSelected&nbsp;=&nbsp;jindo.$A(this._convertArray(this._vLastSelected));
		
		if&nbsp;(elSelectable)&nbsp;{&nbsp;//select
			var&nbsp;bWithinSelected&nbsp;=&nbsp;jindo.$A(this._convertArray(this._vLastSelected)).has(elSelectable);
			
			/**
				선택가능한&nbsp;객체&nbsp;위에서&nbsp;마우스다운되었을때
				
				@event&nbsp;selectStart
				@param&nbsp;{String}&nbsp;sType&nbsp;커스텀&nbsp;이벤트명
				@param&nbsp;{Array&nbsp;||&nbsp;HTMLElement}&nbsp;vLastSelected&nbsp;이전에&nbsp;선택된&nbsp;객체
				@param&nbsp;{HTMLElement}&nbsp;elSelectable&nbsp;마우스다운된&nbsp;선택가능한&nbsp;객체
				@param&nbsp;{Boolean}&nbsp;bWithinSelected&nbsp;이전에&nbsp;선택된&nbsp;객체들&nbsp;중에서&nbsp;선택이&nbsp;시작되었는지&nbsp;여부
				@param&nbsp;{jindo.$Event}&nbsp;weEvent&nbsp;mousedown&nbsp;이벤트
				@param&nbsp;{Function}&nbsp;stop&nbsp;수행시&nbsp;선택이&nbsp;시작되지&nbsp;않음
				@example
					//&nbsp;커스텀&nbsp;이벤트&nbsp;핸들링&nbsp;예제
					oSelectArea.attach(&quot;selectStart&quot;,&nbsp;function(oCustomEvent)&nbsp;{&nbsp;...&nbsp;});
			**/
			if&nbsp;(this.fireEvent(&quot;selectStart&quot;,&nbsp;{
				vLastSelected&nbsp;:&nbsp;this._vLastSelected,
				elSelectable&nbsp;:&nbsp;elSelectable,
				bWithinSelected&nbsp;:&nbsp;bWithinSelected,
				weEvent&nbsp;:&nbsp;we
			}))&nbsp;{
				if&nbsp;(bWithinSelected&nbsp;&amp;&amp;&nbsp;!htKey.shift&nbsp;&amp;&amp;&nbsp;!htKey[this._sCtrl])&nbsp;{
					this._elWaitMouseUp&nbsp;=&nbsp;elSelectable;
					this._wfMouseUpWithinSelected.attach(this._elWaitMouseUp,&nbsp;&quot;mouseup&quot;);
				}&nbsp;else&nbsp;{
					var&nbsp;bRemainSelected&nbsp;=&nbsp;false;
					if&nbsp;(this.option(&quot;bMultiSelection&quot;))&nbsp;{
						if&nbsp;(htKey.shift)&nbsp;{
							if&nbsp;(htKey[this._sCtrl])&nbsp;{
								bRemainSelected&nbsp;=&nbsp;true;
							}
							var&nbsp;aSelectable&nbsp;=&nbsp;this._getSelectableUntil(elSelectable);
							if&nbsp;(aSelectable&nbsp;==&nbsp;elSelectable)&nbsp;{
								this._elStartPoint&nbsp;=&nbsp;elSelectable;	
							}
							this.select(aSelectable,&nbsp;bRemainSelected,&nbsp;false);
						}&nbsp;else&nbsp;{
							this._elStartPoint&nbsp;=&nbsp;elSelectable;
							if&nbsp;(htKey[this._sCtrl])&nbsp;{
								this.toggle(elSelectable,&nbsp;false);
							}&nbsp;else&nbsp;{
								this.select(elSelectable,&nbsp;bRemainSelected,&nbsp;false);
							}
						}&nbsp;
					}&nbsp;else&nbsp;{
						if&nbsp;(!this.option(&quot;bRemainOne&quot;)&nbsp;&amp;&amp;&nbsp;this.option(&quot;bToggleSelected&quot;)&nbsp;&amp;&amp;&nbsp;this.getSelected()&nbsp;==&nbsp;elSelectable)&nbsp;{&nbsp;//when&nbsp;trying&nbsp;select&nbsp;selected&nbsp;by&nbsp;itself
							this.deselect(elSelectable,&nbsp;false);
						}&nbsp;else&nbsp;{
							this.select(elSelectable,&nbsp;bRemainSelected,&nbsp;false);
						}
					}
					
					this._fireChangeEvent(aLastSelected);
					/**
						선택이&nbsp;종료되었을&nbsp;때
						
						@event&nbsp;selectEnd
						@param&nbsp;{String}&nbsp;sType&nbsp;커스텀&nbsp;이벤트명
						@param&nbsp;{Array&nbsp;||&nbsp;HTMLElement}&nbsp;vSelected&nbsp;선택된&nbsp;객체
						@example
							//&nbsp;커스텀&nbsp;이벤트&nbsp;핸들링&nbsp;예제
							oSelectArea.attach(&quot;selectEnd&quot;,&nbsp;function(oCustomEvent)&nbsp;{&nbsp;...&nbsp;});
					**/
					this.fireEvent(&quot;selectEnd&quot;,&nbsp;{
						vSelected&nbsp;:&nbsp;this.getSelected()
					});
				}
			}
		}&nbsp;else&nbsp;{&nbsp;//drag
			this._wfMouseUp.attach(document,&nbsp;&quot;mouseup&quot;);
			this._wfCompute.attach(window,&nbsp;&quot;resize&quot;).attach(this._el,&nbsp;&quot;scroll&quot;);
			
			if&nbsp;(this.option(&quot;bMultiSelection&quot;)&nbsp;&amp;&amp;&nbsp;this.option(&quot;bDragSelect&quot;))&nbsp;{
				this._bOverThreshold&nbsp;=&nbsp;null;
				this._htDragStartPos&nbsp;=&nbsp;we.pos();
				this._htDragStartPos.scrollTop&nbsp;=&nbsp;this._el.scrollTop;
				this._htDragStartPos.scrollLeft&nbsp;=&nbsp;this._el.scrollLeft;
				this._wfMouseMove.attach(document,&nbsp;&quot;mousemove&quot;);
			}
		}
	},
	
	_onDragSelectStart&nbsp;:&nbsp;function(we)&nbsp;{
		we.stop(jindo.$Event.CANCEL_DEFAULT);
	},
	
	_getRectangleElement&nbsp;:&nbsp;function()&nbsp;{
		if&nbsp;(!this._welRectIndicator&nbsp;&amp;&amp;&nbsp;this.option(&quot;bMultiSelection&quot;)&nbsp;&amp;&amp;&nbsp;this.option(&quot;bDragSelect&quot;))&nbsp;{
			this._welRectIndicator&nbsp;=&nbsp;jindo.$Element(jindo.$(&#39;&lt;div&nbsp;style=&quot;position:absolute;left:-10px;top:-10px;width:1px;height:1px;margin:0;padding:0;border:1px&nbsp;dotted&nbsp;black;z-index:99999;&quot;&gt;&#39;));
			this._welRectIndicator.appendTo(this._el);
		}&nbsp;
		return&nbsp;this._welRectIndicator;
	},
	
	/**
		드래그&nbsp;선택시&nbsp;보여지는&nbsp;사각&nbsp;선택영역&nbsp;엘리먼트를&nbsp;가져온다.
		
		@method&nbsp;getRectangleElement
		@return&nbsp;{HTMLElement}&nbsp;
	**/
	getRectangleElement&nbsp;:&nbsp;function()&nbsp;{
		return&nbsp;this._getRectangleElement().$value();
	},
	
	_computeSizeAndPos&nbsp;:&nbsp;function()&nbsp;{
		var&nbsp;aSizeInfo&nbsp;=&nbsp;this._aSizeInfo&nbsp;=&nbsp;[];
			
		jindo.$A(this.getSelectableElement()).forEach(function(el){
			aSizeInfo.push([
				el,&nbsp;el.offsetLeft,&nbsp;el.offsetTop,&nbsp;el.offsetLeft&nbsp;+&nbsp;el.offsetWidth,&nbsp;el.offsetTop&nbsp;+&nbsp;el.offsetHeight
			]);
		});
	},
	
	_onMouseMove&nbsp;:&nbsp;function(we)&nbsp;{
		this._htDragEndPos&nbsp;=&nbsp;we.pos();
		var&nbsp;welRect&nbsp;=&nbsp;this._getRectangleElement(),&nbsp;elRect&nbsp;=&nbsp;welRect.$value();
		var&nbsp;nGapX&nbsp;=&nbsp;this._htDragEndPos.pageX&nbsp;-&nbsp;this._htDragStartPos.pageX;
		var&nbsp;nGapY&nbsp;=&nbsp;this._htDragEndPos.pageY&nbsp;-&nbsp;this._htDragStartPos.pageY;
		var&nbsp;nX&nbsp;=&nbsp;this._htDragStartPos.layerX;
		var&nbsp;nY&nbsp;=&nbsp;this._htDragStartPos.layerY;
		
		var&nbsp;nThreshold&nbsp;=&nbsp;this.option(&quot;nThreshold&quot;);
		if&nbsp;(nThreshold&nbsp;&amp;&amp;&nbsp;!this._bOverThreshold)&nbsp;{
			var&nbsp;nDistance&nbsp;=&nbsp;Math.sqrt(nGapX&nbsp;*&nbsp;nGapX&nbsp;+&nbsp;nGapY&nbsp;*&nbsp;nGapY);
			
			if&nbsp;(nThreshold&nbsp;&gt;&nbsp;nDistance){
				return;
			}
			
			/**
				다중선택시&nbsp;drag를&nbsp;시작할&nbsp;때
				
				@event&nbsp;dragStart
				@param&nbsp;{String}&nbsp;sType&nbsp;커스텀&nbsp;이벤트명
				@example
					//&nbsp;커스텀&nbsp;이벤트&nbsp;핸들링&nbsp;예제
					oSelectArea.attach(&quot;dragStart&quot;,&nbsp;function(oCustomEvent)&nbsp;{&nbsp;...&nbsp;});
			**/
			this.fireEvent(&quot;dragStart&quot;);
			this._bOverThreshold&nbsp;=&nbsp;true;
			this._computeSizeAndPos();
			this._nRectX&nbsp;=&nbsp;nX;
			this._nRectY&nbsp;=&nbsp;nY;
			this._nDragDirectionX&nbsp;=&nbsp;1;
			this._nDragDirectionY&nbsp;=&nbsp;1;
			welRect.offset(nY,&nbsp;nX);
			
			if&nbsp;(!we.key()[this._sCtrl])&nbsp;{
				this.deselectAll(false);
			}&nbsp;
		}
		var&nbsp;nWidth&nbsp;=&nbsp;nGapX;
		var&nbsp;nHeight&nbsp;=&nbsp;nGapY;
		this._placeRect(nX,&nbsp;nY,&nbsp;nWidth,&nbsp;nHeight);
		
		this._setToggleCandidate(this._getSelectableByRect([elRect,&nbsp;elRect.offsetLeft,&nbsp;elRect.offsetTop,&nbsp;elRect.offsetLeft&nbsp;+&nbsp;elRect.offsetWidth,&nbsp;elRect.offsetTop&nbsp;+&nbsp;elRect.offsetHeight]));
	},
	
	_placeRect&nbsp;:&nbsp;function(nX,&nbsp;nY,&nbsp;nWidth,&nbsp;nHeight)&nbsp;{
		var&nbsp;welRect&nbsp;=&nbsp;this._getRectangleElement();
		welRect.show();
		this._nDragDirectionX&nbsp;=&nbsp;(nX&nbsp;&gt;&nbsp;this._nRectX&nbsp;)&nbsp;?&nbsp;1&nbsp;:&nbsp;-1;
		this._nDragDirectionY&nbsp;=&nbsp;(nY&nbsp;&gt;&nbsp;this._nRectY&nbsp;)&nbsp;?&nbsp;1&nbsp;:&nbsp;-1;
	
		nWidth&nbsp;-=&nbsp;((this._el.scrollLeft&nbsp;-&nbsp;this._htDragStartPos.scrollLeft)&nbsp;*&nbsp;this._nDragDirectionX);
		nHeight&nbsp;-=&nbsp;((this._el.scrollTop&nbsp;-&nbsp;this._htDragStartPos.scrollTop)&nbsp;*&nbsp;this._nDragDirectionY);

		welRect.width(Math.max(Math.abs(nWidth),&nbsp;2)).height(Math.max(Math.abs(nHeight),&nbsp;2));
		
		nX&nbsp;+=&nbsp;Math.min(nWidth,&nbsp;0);
		nY&nbsp;+=&nbsp;Math.min(nHeight,&nbsp;0);
		welRect.css(&quot;left&quot;,&nbsp;nX&nbsp;+&nbsp;&quot;px&quot;).css(&quot;top&quot;,&nbsp;nY&nbsp;+&nbsp;&quot;px&quot;);
	},
	
	_getSelectableByRect&nbsp;:&nbsp;function(aRect)&nbsp;{&nbsp;//[welRect.$value(),&nbsp;nX,&nbsp;nY,&nbsp;nX&nbsp;+&nbsp;nWidth,&nbsp;nY&nbsp;+&nbsp;nHeight]
		var&nbsp;aReturn&nbsp;=&nbsp;[];
		
		jindo.$A(this._aSizeInfo).forEach(function(aSelectable){
			if&nbsp;(aSelectable[1]&nbsp;&lt;&nbsp;aRect[3]&nbsp;&amp;&amp;&nbsp;aSelectable[3]&nbsp;&gt;&nbsp;aRect[1]&nbsp;&amp;&amp;&nbsp;aSelectable[2]&nbsp;&lt;&nbsp;aRect[4]&nbsp;&amp;&amp;&nbsp;aSelectable[4]&nbsp;&gt;&nbsp;aRect[2])&nbsp;{
				aReturn.push(aSelectable[0]);
				jindo.$A.Continue();
			}
		});
		
		return&nbsp;aReturn;
	},
	
	_setToggleCandidate&nbsp;:&nbsp;function(a)&nbsp;{
		a&nbsp;=&nbsp;this._convertArray(a);

		var&nbsp;bChanged&nbsp;=&nbsp;false;
		if&nbsp;(this._waToggleCandidate.length()&nbsp;!=&nbsp;a.length)&nbsp;{
			bChanged&nbsp;=&nbsp;true;
		}
		
		var&nbsp;htStatus&nbsp;=&nbsp;this.option(&quot;htStatus&quot;);
		
		//clear
		var&nbsp;wa&nbsp;=&nbsp;jindo.$A(a);
		var&nbsp;waRemove&nbsp;=&nbsp;jindo.$A([]);
		this._waToggleCandidate.forEach(function(el,&nbsp;i){
			if&nbsp;(!wa.has(el))&nbsp;{
				waRemove.push(el);
				bChanged&nbsp;=&nbsp;true;
			}
		});
		
		//dragSelecting
		if&nbsp;(bChanged)&nbsp;{
			waRemove.forEach(function(el){
				this._waToggleCandidate&nbsp;=&nbsp;this._waToggleCandidate.refuse(el);
				jindo.$Element(el).toggleClass(htStatus.sSelected);
			},&nbsp;this);
			
			wa.forEach(function(el){
				if&nbsp;(this.isSelected(el))&nbsp;{
					jindo.$Element(el).removeClass(htStatus.sSelected);
				}&nbsp;else&nbsp;{
					jindo.$Element(el).addClass(htStatus.sSelected);	
				}
			},&nbsp;this);
			
			this._waToggleCandidate&nbsp;=&nbsp;jindo.$A(this._waToggleCandidate.$value().concat(a)).unique();
			/**
				drag되어&nbsp;설정된&nbsp;선택영역안에&nbsp;선택가능한&nbsp;객체가&nbsp;변경될때&nbsp;발생
				
				@event&nbsp;dragSelecting
				@param&nbsp;{String}&nbsp;sType&nbsp;커스텀&nbsp;이벤트명
				@param&nbsp;{Array}&nbsp;aSelectable&nbsp;선택영역안에&nbsp;포함된&nbsp;객체
				@example
					//&nbsp;커스텀&nbsp;이벤트&nbsp;핸들링&nbsp;예제
					oSelectArea.attach(&quot;dragSelecting&quot;,&nbsp;function(oCustomEvent)&nbsp;{&nbsp;...&nbsp;});
			**/
			this.fireEvent(&quot;dragSelecting&quot;,&nbsp;{&nbsp;aSelectable&nbsp;:&nbsp;this._waToggleCandidate.$value()&nbsp;});
		}
	},
	
	_onMouseUp&nbsp;:&nbsp;function(we)&nbsp;{
		var&nbsp;bDeselectAll&nbsp;=&nbsp;(!this.isDragging()&nbsp;&amp;&amp;&nbsp;!we.key()[this._sCtrl]&nbsp;&amp;&amp;&nbsp;(!this.option(&quot;bRemainOne&quot;)&nbsp;&amp;&amp;&nbsp;this.option(&quot;bDeselectAllOutside&quot;))),
			bHasCandidate&nbsp;=&nbsp;this._waToggleCandidate.length(),
			aLastSelected&nbsp;=&nbsp;this._convertArray(this.getSelected()).concat();
		
		if&nbsp;(bDeselectAll)&nbsp;{
			this.deselectAll(false);
		}
		if&nbsp;(bHasCandidate)&nbsp;{
			this._elStartPoint&nbsp;=&nbsp;this._waToggleCandidate.$value()[0];
			this.toggle(this._waToggleCandidate.$value());
		}
		this._fireChangeEvent(aLastSelected);
		
		this._stopDragging();
	},
	
	/**
		이미&nbsp;선택된&nbsp;엘리먼트내에서&nbsp;클릭하여&nbsp;선택하려고할때&nbsp;mouseup이전에&nbsp;이&nbsp;메서드가&nbsp;호출되면&nbsp;선택되지&nbsp;않는다.
		
		@method&nbsp;stopSelecting
		@remark&nbsp;다중선택시&nbsp;이미&nbsp;선택된&nbsp;엘리먼트내에서&nbsp;선택하려고하는&nbsp;경우에는&nbsp;mouseup시에&nbsp;선택이&nbsp;되게&nbsp;된다.
		@return&nbsp;{this}
	**/
	stopSelecting&nbsp;:&nbsp;function()&nbsp;{
		this._wfMouseUpWithinSelected.detach(this._elWaitMouseUp,&nbsp;&quot;mouseup&quot;);
		return&nbsp;this;
	},
	
	/**
		셀렉트를&nbsp;위해&nbsp;드래그되고&nbsp;있는지&nbsp;여부를&nbsp;가져온다.
		
		@method&nbsp;isDragging
		@return&nbsp;{Boolean}
	**/
	isDragging&nbsp;:&nbsp;function()&nbsp;{
		return&nbsp;this._bOverThreshold;
	},
	
	_restore&nbsp;:&nbsp;function()&nbsp;{
		jindo.$ElementList(this._waToggleCandidate.$value()).removeClass(this.option(&quot;htStatus&quot;).sSelected);
		this.deselectAll(false);
		if&nbsp;(this._waLastSelected.$value().length)&nbsp;{
			this.select(this._waLastSelected.$value(),&nbsp;false,&nbsp;false);
		}
	},
	
	_stopDragging&nbsp;:&nbsp;function()&nbsp;{
		this._waToggleCandidate.empty();
		this._htDragStartPos&nbsp;=&nbsp;null;
		this._htDragEndPos&nbsp;=&nbsp;null;
		this._wfMouseMove.detach(document,&nbsp;&quot;mousemove&quot;);
		this._wfMouseUp.detach(document,&nbsp;&quot;mouseup&quot;);
		this._wfCompute.detach(window,&nbsp;&quot;resize&quot;).detach(this._el,&nbsp;&quot;scroll&quot;);
		
		if&nbsp;(this.isDragging())&nbsp;{
			this._bOverThreshold&nbsp;=&nbsp;null;
			this._getRectangleElement().hide();
			/**
				다중선택시&nbsp;drag가&nbsp;끝났을&nbsp;때
				
				@event&nbsp;dragEnd
				@param&nbsp;{String}&nbsp;sType&nbsp;커스텀&nbsp;이벤트명
				@example
					//&nbsp;커스텀&nbsp;이벤트&nbsp;핸들링&nbsp;예제
					oSelectArea.attach(&quot;dragEnd&quot;,&nbsp;function(oCustomEvent)&nbsp;{&nbsp;...&nbsp;});
			**/
			this.fireEvent(&quot;dragEnd&quot;);
		}
	},
	
	/**
		셀렉트를&nbsp;위한&nbsp;drag를&nbsp;중단한다.
		드래그&nbsp;이전에&nbsp;선택되어있던&nbsp;상태로&nbsp;복귀된다.
		
		@method&nbsp;stopDragging
		@return&nbsp;{this}
	**/
	stopDragging&nbsp;:&nbsp;function()&nbsp;{
		if&nbsp;(this.isDragging())&nbsp;{
			this._restore();
			this._stopDragging();
		}
		return&nbsp;this;
	},
	
	_onMouseUpWithinSelected&nbsp;:&nbsp;function(we)&nbsp;{
		this.stopSelecting();
		
		var&nbsp;elSelectable&nbsp;=&nbsp;this._findSelectableElement(we.element);
		if&nbsp;(elSelectable&nbsp;&amp;&amp;&nbsp;elSelectable&nbsp;==&nbsp;we.currentElement)&nbsp;{
			this.deselectAll(false);
			this.select(elSelectable,&nbsp;false,&nbsp;true);
		}
	},
	
	_onActivate&nbsp;:&nbsp;function()&nbsp;{
		this._sMozUserSelect&nbsp;=&nbsp;this._wel.css(&quot;MozUserSelect&quot;);
		this._wel.css(&quot;MozUserSelect&quot;,&nbsp;&quot;none&quot;);
		
		jindo.$Element.prototype.preventTapHighlight&nbsp;&amp;&amp;&nbsp;this._wel.preventTapHighlight(true);
		this._wfMouseDown.attach(this._el,&nbsp;&quot;mousedown&quot;);
		this._wfDragStart.attach(this._el,&nbsp;&quot;dragstart&quot;);
		this._wfSelectStart.attach(this._el,&nbsp;&#39;selectstart&#39;);
	},
	
	_onDeactivate&nbsp;:&nbsp;function()&nbsp;{
		this._wel.css(&quot;MozUserSelect&quot;,&nbsp;this._sMozUserSelect&nbsp;||&nbsp;&#39;&#39;);
		
		jindo.$Element.prototype.preventTapHighlight&nbsp;&amp;&amp;&nbsp;this._wel.preventTapHighlight(false);
		this._wfMouseDown.detach(this._el,&nbsp;&quot;mousedown&quot;);
		this._wfDragStart.detach(this._el,&nbsp;&quot;dragstart&quot;);
		this._wfSelectStart.detach(this._el,&nbsp;&#39;selectstart&#39;);
	}
	
}).extend(jindo.UIComponent);
</pre>
		</div>
	</div>
</div>

			</div>
		</div>
		<!-- // main content -->

	</div>
	<!-- // container -->

	<!-- footer -->
	<div id="footer">
		<p>Copyright ©<a href="http://nhncorp.com/" target="_blank">NHN Corp.</a> Platform Ajax Team. All Rights Reserved.</p>
	</div>
	<!-- // footer -->

</div>
<!-- // wrap -->

<style type="text/css">

	.item {
		transition:background .2s linear;
		-webkit-transition:background .2s linear;
		-moz-transition:background .2s linear;
		-o-transition:background .2s linear;
		-ms-transition:background .2s linear;
	}
	
	.highlight {
		background-color:#ffffd8 !important;
	}
	
	li.selected a.highlight {
		background-color:#aa8 !important;
	}
	
	.hide-deprecated .deprecated-item, .hide-inherited .inherited-item, .private {
		display:none;
	}
	
	.scrollbar-v, .scrollbar-h { display:none; }
	.scrollbar-show { display:block; }
	
	.api-page .tbl_fold .more_history { display:none; }
	
	/* FILE */
	.file pre.code {
		border:1px solid #ccc;
		padding:0;
	}
	
	.file ol {
		padding-left: 4em;
		background-color: #f9f9f9;
	}

	.file ol li {
		list-style: decimal;
		border-left:1px solid #ccc;
		padding:2px 4px;
	}
	
	.file li.L1, .file li.L3, .file li.L5, .file li.L7, .file li.L9 {
		background-color: #f9f9f9;	
	}

	.file li.L0, .file li.L2, .file li.L4, .file li.L6, .file li.L8 { 
		background-color: #f0f0f0;
	}
	
</style>
<script type="text/javascript" src="../assets/prettify/prettify-min.js"></script>
<script type="text/javascript" src="../assets/hash.js"></script>
<script type="text/javascript" src="../assets/api-list.js"></script>
<script type="text/javascript" src="../assets/api-search.js"></script>
<script type="text/javascript" src="../assets/../api.js?callback=APISearch.setData"></script>
<script type="text/javascript">
	var projectRoot = "../";
	var projectAssets = "../assets";
	
    apiDocs(projectAssets);	
</script>
</body>
</html>